<!doctype html>
<html ng-app>
  <head>
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.0.8/angular.min.js"></script>
    <style type="text/css">
      .selected {
        background-color: lightgreen;
      }
    </style>
  </head>
  <body>
    <table ng-controller='RestaurantTableController'>
      <tr ng-repeat='restaurant in directory' ng-click='selectRestaurant($index)'
          ng-class='{selected: $index==selectedRow}'>
        <td>{{restaurant.name}}</td>
        <td>{{restaurant.cuisine}}</td>
      </tr>
    </table>
    <script>
      function RestaurantTableController($scope) {
        $scope.directory = [{name:'The Handsome Heifer', cuisine:'BBQ'},
          {name:'Green\'s Green Greens', cuisine:'Salads'},
          {name:'House of Fine Fish', cuisine:'Seafood'}];

        $scope.selectRestaurant = function(row) {
          $scope.selectedRow = row;
        };
      }
    </script>
  </body>
</html>
